<div class="carousel-container">
	<div class="button-prev">
		<a href="javascript:stepcarousel.stepBy('carousel', -1)"><img src="/tecnicosya/web/img/arrow_left.png" /></a>
	</div>
		
	<div class="button-next">
		<a href="javascript:stepcarousel.stepBy('carousel', 1)"><img src="/tecnicosya/web/img/arrow_right.png" /></a>
	</div>
	
	<div id="carousel" class="stepcarousel">
		<div class="belt">
			<?php foreach ($lista_imagenes as $imagen):?>
			<div class="panel">
				<img height="100%" width="100%" src="/tecnicosya/web/pictures/<?php echo $imagen['archivo'];?>"/>				
				<div class="panel-text">
					<p><?php echo $imagen['titulo'];?></p>
				</div>
			</div>
			<?php endforeach;?>			
		</div>
	</div>
	
	<script type="text/javascript">
	
		stepcarousel.setup({
			galleryid: 'carousel', //id of carousel DIV
			beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
			panelclass: 'panel', //class of panel DIVs each holding content
			autostep: {enable:true, moveby:1, pause:3000},
			panelbehavior: {speed:500, wraparound:true, persist:true},
			statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
			contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']
		});
	
	</script>
</div>
